<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Admin Template">
    <meta name="keywords" content="flask jquery js python">
    <link rel="shortcut icon" type="image/png" href="/blogobj/images/home/code1.jpg">
    <title>注册|呵哈糊涂</title>

    <!-- Base Styles -->
    <link href="/basetemplate/css/style.css" rel="stylesheet">
    <link href="/basetemplate/css/style-responsive.css" rel="stylesheet">
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="/basetemplate/js/html5shiv.min.js"></script>
    <script src="/basetemplate/js/respond.min.js"></script>
    <![endif]-->
</head>
<body class="login-body">

<div class="login-logo">
    <img src="/blogobj/images/home/logo.png" alt=""/>
</div>

<h2 class="form-heading">注册</h2>
<div class="container log-row">
    <form class="form-signin" action="" id="adminreg" method="post">

        <p>输入必要的信息</p>
        <input type="text" class="form-control" placeholder="用户名" autofocus id="name" name="name">
        <input type="password" class="form-control" placeholder="密码" id="password" name="password">
        <input type="password" class="form-control" placeholder="重复输入密码" id="repeatPwd" name="repeatPwd">
        <input type="text" class="form-control" placeholder="邮箱" id="email" name="email">
        <div class="row col-lg-offset-1">
            <label  for="agree" >用户协议? &ensp; </label><input type="checkbox" id="agree" name="agree">
        </div>
        <button class="btn btn-lg btn-success btn-block" type="submit" >注册</button>
        <div class="registration m-t-20 m-b-20">
            已经注册?
            <a class="" href="{{ url_for('.login') }}">
                登录
            </a>
        </div>
    </form>

    <div aria-hidden="true" aria-labelledby="myModalLabel" role="dialog" tabindex="-1" id="successReg" class="modal fade">
                  <div class="modal-dialog">
                      <div class="modal-content">
                          <div class="modal-header">
                              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                              <h4 class="modal-title">注册成功</h4>
                          </div>
                          <div class="modal-body">
                              <p id="userInfo" class="text-success">(｡･∀･)ﾉﾞ嗨：</p>
                              <p>您的账户已注册成功，5秒后将跳转到登录</p>
                          </div>
                          <div class="modal-footer">
                              <button class="btn btn-success" type="button">确定</button>
                          </div>
                      </div>
                  </div>
              </div>
</div>

<!--jquery-1.10.2.min-->
{#<script src="/basetemplate/js/jquery-1.11.1.min.js"></script>#}
<script src="/blogobj/js/jquery-3.1.0.min.js"></script>
<script src="//cdn.bootcss.com/jquery-validate/1.15.1/jquery.validate.min.js"></script>
<script src="//cdn.bootcss.com/jquery-validate/1.15.1/additional-methods.min.js"></script>
<!--Bootstrap Js-->
<script src="/basetemplate/js/bootstrap.min.js"></script>
{#<script src="/basetemplate/js/jrespond..min.js"></script>#}


</body>
</html>
<script>
    $(document).ready(function () {
        $("#adminreg").validate({
            rules: {
                name: {required: true, minlength: 3, maxlength: 12, remote: '/user/checkuser/'},
                password: {required: true, minlength: 6, maxlength: 12},
                repeatPwd: {required: true, equalTo: "#password"},
                email: {required: true, email: true},
                agree: {required: true}
            },
            messages: {
                name: {required: "用户名不能为空", minlength: "用户名长度不能小于3个字符", maxlength: "用户名不能大于12个字符", remote: "用户名已存在请换个试试"},
                password: {required: "密码不能为空", minlength: "密码字符长度不能小于6个字符", maxlength: "密码字符长度不能大于12个字符"},
                repeatPwd: {required: "重复密码必须填写", equalTo: "密码不一致"},
                email: {required: "邮箱不能为空", email: "邮箱格式不正确"},
                agree: {required: "用户协议必须同意才能注册"}
            },
            submitHandler: function (form) {
                $.ajax({
                    method: 'POST',
                    data: $("form").serialize(),
                    url: '{{ url_for('.reg') }}',
                    success: function (rep) {
                        $("#userInfo").append(rep.name);
                        $("#successReg").modal();
                        setTimeout(function () {
                            window.location.href='{{ url_for('.login') }}'
                        },5000);
                    }
                });
            }
        });
    });
</script>